<template>
	<view class="content">
		<view class="code">
			<uv-qrcode ref="qrcode" size="284rpx" :value="data.id"></uv-qrcode>
			<text>{{data.productInfoName}}</text>
		</view>
		<text class="title">使用需知</text>
		<view class="item" @click="bindAllShop">
			<text class="label">适用门店</text>
			<view class="">
				<text class="value">查看支持门店</text>
				<image src="../../static/right.png" class="right" mode=""></image>
			</view>
		</view>
	</view>
	<text class="ts">*温馨提示</text>
	<text class="ts">1、本券仅限本人当场打开使用,每天仅限使用一次</text>
	<text class="ts">2、如洗车券码购买是 7 座以下的，需线下单独补差价</text>
	<text class="ts">3、若购买保养类服务，核销时请联系门店人员详情服务项目</text>



</template>

<script setup>
	import {
		evidenceInfo
	} from '@/api'
	import {
		onLoad,
	} from '@dcloudio/uni-app'
	import {
		ref
	} from 'vue';
	const orderId = ref()
	const code = ref()
	const data = ref()
	onLoad((params) => {
		orderId.value = params.orderId
		code.value = params.code
		getData()
	})
	/** 全部门店 */
	const bindAllShop = () => {
		uni.setStorageSync('storeList', data.value.storeInfoVoList)
		uni.navigateTo({
			url: "/pages/allShop/allShop"
		})
	}
	const getData = async () => {
		uni.getLocation({
			type: 'wgs84',
			success: async (res) => {


				const data1 = await evidenceInfo({
					orderId: orderId.value,
					lot: res.longitude,
					lat: res.latitude
				})
				data.value = data1.result
			},
			fail: (err) => {
				uni.showModal({
					title: '位置授权提示',
					content: '打开定位失败，您可以检查手机定位是否开启后手动进行位置授权'
				})
			}
		});

	}
</script>

<style lang="scss">
	page {
		background: #F8F5F0;
	}

	.content {
		margin: 21rpx auto 30rpx;
		width: 630rpx;
		padding: 0 36rpx 0 36rpx;
		background: #FFFFFF;
		border-radius: 36rpx;
		overflow: hidden;

		.code {
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
			margin-top: 100rpx;

			text {
				display: block;
				text-align: center;
				margin-top: 28rpx;
				font-size: 30rpx;
				color: #16191B;
			}
		}

		.title {
			font-weight: bold;
			font-size: 30rpx;
			color: #16191B;
			display: block;
			margin-top: 95rpx;
			padding-bottom: 32rpx;
			border-bottom: 2rpx solid #F2F2F2;
		}

		.item {
			height: 110rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;

			.label {
				font-size: 30rpx;
				color: #16191B;
			}

			.value {
				font-size: 28rpx;
				color: #A5A5A5;
			}

			.right {
				width: 38rpx;
				height: 38rpx;
				display: block;
				margin-left: 18rpx;
			}

			>view {
				display: flex;
				align-items: center;
			}
		}
	}

	.ts {
		display: block;
		font-size: 24rpx;
		color: #8A8A8A;
		margin-left: 20px;
	}
</style>